<!DOCTYPE html>
<!-- saved from url=(0026)http://www.luoo.net/event/ -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta name="viewport" content="width=device-width,user-scalable=no">
    <meta property="qc:admins" content="4553322067645776654">
    <meta property="wb:webmaster" content="78f40d1511de8c6b">
    <meta name="baidu-site-verification" content="xC1m9aYTgX">
    <title>活动</title>
    <meta name="description" content="# ">
    <meta name="keywords" content="#">
    <link rel="stylesheet" href="/css/event.css">
    <link type="image/x-icon" href="/img/icon-logo.png" rel="shortcut icon">
    <script type="text/javascript" async="" src="/js/ga.js"></script>
    <script src="/js/hm.js"></script>
    <script src="/js/jquery-1.11.0.min.js"></script>

    <script src="/js/luoo.js"></script>

</head>
<body>

<!-- header start -->
<div class="header" th:replace="~{portal/nav :: topbar}">

</div>
<!--/// header end -->    <!-- container start -->
<div class="container" style="min-height: 499px;">
    <div class="clearfix">
        <!-- article start-->
        <div class="article article-sm">
            <!-- event-list-wrapper -->
            <div class="event-list-wrapper">
                <div class="page-nav rounded clearfix">
                    <div class="curt-nav">
                        <!--如果后台没有返回用户选择的分类Id,则将样式设置为激活-->
                        <a href="/event?pn=1" class="item actived" th:class="${null==cityId?'item actived':'item'}">最新活动</a>
                    </div>
                    <div class="pagenav-wrapper">
                        <!--遍历所有分类并生成元素,当后台返回的用户选择的分类Id等于遍历取出的分类Id时将css样式变为激活-->
                        <a href="/event?city=1&pn=1" class="item" th:class="${city.id == cityId?'item actived':'item'}" th:href="'/event?city='+${city.id}"  th:text="${city.name}" th:each="city,cityStat:${cityPage.content}">上海</a>
                    </div>
                </div>

                <!-- event-list -->
                <div class="event-list">

                    <div class="item item-expired clearfix" th:each="event,eventStat:${eventPage}"
                         th:if="${eventStat.index}<10">
                        <a href="/event/15660" class="cover-wrapper" th:href="'/event/'+${event.id}">
                            <img src="/img/test/testEventCoverImg.jpg" alt="活动标题" class="cover rounded" th:src="${event.coverImgAddr}" th:alt="${event.name}">
                        </a>
                        <ul class="info">
                            <li>
                                <a href="/event/15660" class="name" th:href="'/event/'+${event.id}"
                                   th:text="${event.name}">活动标题</a>
                            </li>
                            <li>时间： [[${#dates.format(event.time,'yyyy-MM-dd')}]]</li>
                            <li>主题： [[${event.theme}]]</li>
                            <li>城市： [[${event.city.name}]]</li>
                            <li>场所： [[${event.location}]]</li>
                            <li>费用： [[${event.money}]]</li>
                        </ul>
                    </div>

                </div>
                <!--/// event-list end-->

            </div>
            <!--/// event-list-wrapper end-->

            <!--生成的不带城市参数的页面跳转url-->
            <div class="paginator" th:if="${null == cityId && eventPage.totalPages>1}">
                <a class="previous" href="/event?pn=1" th:href="'/event?pn=1'" >首页</a>
                <a class="previous"  th:href="'/event?pn='+${eventPage.number}" th:if="${eventPage.hasPrevious()}" >上一页</a><!--<a class="page actived" rel="nofollow" href="javascript:;">1</a>-->
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number -3}" th:text="${eventPage.number -3}" th:if="${eventPage.number } >3 ">1</a>
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number -2}" th:text="${eventPage.number -2}" th:if="${eventPage.number } >2 ">2</a>
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number -1}" th:text="${eventPage.number -1}" th:if="${eventPage.number } >1 ">3</a>
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number }" th:text="${eventPage.number}" th:if="${eventPage.number >0}">4</a> <!--判断如果在当前页码如果有前面的页码则生成-->
                <a class="page actived" href="#" rel="nofollow" th:href="'/event?pn='+${eventPage.number+1}" th:text="${eventPage.number +1}" >5</a><!--假设用户浏览的当前页是第5页,number+1是因为jpa里的pageable默认pn是从0开始的,此时pageable里的number是4-->
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number +2}" th:text="${eventPage.number +2}" th:if="${eventPage.number +2} <= ${eventPage.totalPages }" >6</a><!--判断如果在当前页面有后面的页面则生成-->
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number +3}" th:text="${eventPage.number +3}"  th:if="${eventPage.number +3} <= ${eventPage.totalPages }">7</a>
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number +4}" th:text="${eventPage.number +4}"  th:if="${eventPage.number +4} <= ${eventPage.totalPages }">8</a>
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number +5}" th:text="${eventPage.number +5}" th:if="${eventPage.number +5} <= ${eventPage.totalPages }">9</a>
                <a class="page" href="#" th:href="'/event?pn='+${eventPage.number +6}" th:text="${eventPage.number +6}" th:if="${eventPage.number +6} <= ${eventPage.totalPages }">10</a>
                <a class="next" href="#" th:href="'/event?pn='+${eventPage.number +2}" th:if="${eventPage.hasNext()}">下一页</a>
                <a class="next" href="#" th:href="'/event?pn='+${eventPage.totalPages }" th:if="${eventPage.totalPages }>0">尾页</a>
                <a class="next" href="#" th:href="'/event?pn=1'" th:if="${eventPage.totalPages }==0" >尾页</a>
            </div>

            <!--生成的带城市参数的页面跳转url-->
            <div class="paginator" th:if=" ${null !=cityId && eventPage.totalPages>1} ">
                <a class="previous" href="/event?city=1?pn=1" th:href="'/event?city='+${cityId}+'&pn=1'" >首页</a>
                <a class="previous"  th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number}" th:if="${eventPage.hasPrevious()}" >上一页</a><!--<a class="page actived" rel="nofollow" href="javascript:;">1</a>-->
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number -3}" th:text="${eventPage.number -3}" th:if="${eventPage.number } >3 ">1</a>
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number -2}" th:text="${eventPage.number -2}" th:if="${eventPage.number } >2 ">2</a>
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number -1}" th:text="${eventPage.number -1}" th:if="${eventPage.number } >1 ">3</a>
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number }" th:text="${eventPage.number}" th:if="${eventPage.number >0}">4</a>
                <a class="page actived" href="#" rel="nofollow" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number+1}" th:text="${eventPage.number +1}" >5</a><!--假设用户浏览的当前页是第5页,number+1是因为jpa里的pageable默认pn是从0开始的,此时pageable里的number是4-->
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number +2}" th:text="${eventPage.number +2}" th:if="${eventPage.number +2} <= ${eventPage.totalPages }" >6</a>
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number +3}" th:text="${eventPage.number +3}"  th:if="${eventPage.number +3} <= ${eventPage.totalPages }">7</a>
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number +4}" th:text="${eventPage.number +4}"  th:if="${eventPage.number +4} <= ${eventPage.totalPages }">8</a>
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number +5}" th:text="${eventPage.number +5}" th:if="${eventPage.number +5} <= ${eventPage.totalPages }">9</a>
                <a class="page" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number +6}" th:text="${eventPage.number +6}" th:if="${eventPage.number +6} <= ${eventPage.totalPages }">10</a>
                <a class="next" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.number +2}" th:if="${eventPage.hasNext()}">下一页</a>
                <a class="next" href="#" th:href="'/event?city='+${cityId}+'&pn='+${eventPage.totalPages }" th:if="${eventPage.totalPages }>0">尾页</a>
                <a class="next" href="#" th:href="'/event?city='+${cityId}+'&pn=1'" th:if="${eventPage.totalPages }==0" >尾页</a>
            </div>
            
        </div>
        <!--/// article end-->

        <!-- aside start-->
        <div class="aside">

            <div class="widget">
                <div class="widget-head">
                    <span class="title">最新活动</span>
                </div>

                <div class="widget-ct pic-widget">

                    <div class="item" th:each="newestEvent,newestEventStat:${newestEventPage}"
                         th:if="${newestEventStat.index}<5">
                        <a href="/event/15660" class="cover-wrapper" th:href="'/event/'+${newestEvent.id}">
                            <img src="/img/test/testEventCoverImg.jpg" alt="活动标题" class="event-cover rounded"
                                 th:src="${newestEvent.coverImgAddr}" th:alt="${newestEvent.name}">
                        </a>
                        <div class="info">
                            <a href="/event/15660" title="活动标题" class="wrap-title"
                               th:title="${newestEvent.name}" th:text="${newestEvent.name}"
                               th:href="'/event/'+${newestEvent.id}">活动标题</a>
                            <p th:text="${newestEvent.theme}"></p>
                            <br/>
                            <p th:text="${newestEvent.city.name}"></p>
                        </div>
                    </div>


                </div>
            </div>

            <div class="widget widget-break">
                <div class="widget-ct">
                    <a href="#" class="ln-widget-block rounded">
                        活动提交
                    </a>
                </div>
            </div>

        </div>
        <!--/// aside end-->

    </div>
</div>
<!--/// container end -->
<script type="text/javascript">
    $(function () {
        $('.aside')
            .on("sticky_kit:bottom", function (e) {
                //console.log( $(this) );
                $(this).css({top: 0, bottom: '', position: 'fixed'})
            });
    })
</script>
<script src="/js/jquery.sticky-kit.min.js"></script>
<!--底部区域开始-->
<div class="footer" th:replace="~{portal/footer :: footer}">

</div>
<div id="backTop" style="left: 1451.5px;">&nbsp;</div>
<div id="feedbackWrapper" style="display:none;" th:replace="~{portal/help :: sendQuestion}">

</div>

<div id="mailWrapper" style="display:none;" th:replace="~{portal/help :: sendLetter}">

</div>
<!--底部结束-->


<script src="/js/jquery.artDialog.js"></script>
<script src="/js/jquery.qtip.min.js"></script>
<script src="/js/jquery.cookie.js"></script>
<script src="/js/qrcode.min.js"></script>
<!--[if lt IE 9]>
<script src="http://s.luoo.net/thirdparty/pie/PIE_IE678.js"></script>
<script>
    $(function () {
        if (window.PIE) {
            $('.rounded,.page').each(function () {
                try {
                    PIE.attach(this);
                } catch (e) {
                }
            });
        }
    })
</script>
<![endif]-->


</body>
</html>